import { Component, OnInit, Input, Output, EventEmitter, HostListener, ChangeDetectionStrategy } from '@angular/core';
import {itemAnim} from '../../my-animations/item.animation';

@Component({
  selector: 'app-task-item',
  templateUrl: './task-item.component.html',
  styleUrls: ['./task-item.component.scss'],
  animations:[
    itemAnim
  ],
  //ChangeDetectionStrategy.OnPush 不用检查当前组件树是否变化  除非 你告诉我  手动设置
  changeDetection:ChangeDetectionStrategy.OnPush
})
export class TaskItemComponent implements OnInit {

  @Input() item;
  @Input() avatar;
  @Output() taskClick = new EventEmitter<void>();
  widerPriority:string = 'in';
  constructor() { }

  ngOnInit() {
    this.avatar = this.item.ovner ? this.item.ovner.avatar :'unassigned';
  }
  // 监听 一个数组的事件  @HostListener('mouseenter',['$event,target'])
  @HostListener('mouseenter')
  onMouseEnter(){
    this.widerPriority = 'out';
  }

  @HostListener('mouseleave')
  onMouseLeve(){
    this.widerPriority = 'in';
  }
  onItemClick(){
    this.taskClick.emit()
  }
  onCheckBoxClick(ev){
    ev.stopPropagation();

  }
}
